<template>
    <div class="app-container">

        <SearchContent :queryParams="queryParams" @query="handleQuery" @reset="resetQuery">
            <el-col :span="6">
                <el-form-item label="车架号:" prop="vinNo">
                    <el-input v-model="queryParams.vinNo" clearable placeholder="请输入车架号"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="车牌号:" prop="carNo">
                    <el-input v-model="queryParams.carNo" clearable placeholder="请输入车牌号"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="6">
                <el-form-item label="所属城市:" prop="ascription">
                    <el-input v-model="queryParams.ascription" clearable placeholder="请输入所属城市"></el-input>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="来源:" prop="purchaseSource">
                    <el-select v-model="queryParams.purchaseSource" clearable>
                        <el-option label="全部" :value="0"></el-option>
                        <el-option label="订单采购" :value="1"></el-option>
                        <el-option label="自主采购" :value="2"></el-option>
                        <el-option label="外部转租赁" :value="3"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="业务类型:" prop="businessScopeCode">
                    <el-select v-model="queryParams.businessScopeCode" clearable>
                        <el-option label="全部" :value="0"></el-option>
                        <el-option label="自营" :value="1"></el-option>
                        <el-option label="渠道" :value="2"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="状态:" prop="storageStatus">
                    <el-select v-model="queryParams.storageStatus" clearable>
                        <el-option label="全部" :value="0"></el-option>
                        <el-option label="待入库" :value="1"></el-option>
                        <el-option label="已出库" :value="2"></el-option>
                    </el-select>
                </el-form-item>
            </el-col>

            <el-col :span="6">
                <el-form-item label="客户名称:" prop="customerName">
                    <el-input v-model="queryParams.customerName" clearable placeholder="请输入客户名称"></el-input>
                </el-form-item>
            </el-col>

        </SearchContent>

        <div class="card-wrap paddingAll20" :model="queryParams" ref="queryForm" label-width="86px">
            <div class="table-title-wrap justify-end">
                <el-button type="primary" size="mini" @click="handleExport"
                    v-hasPermi="['letterReview:config:addRules']">导出
                </el-button>
            </div>

            <table-page :loading="loading" :dataList="dataList" :total="total" :page.sync="queryParams.pageNum"
                :limit.sync="queryParams.pageSize" @setSizeCurrent="getList" border>
                <!-- 普通列插槽 -->
                <template slot="tableCol">
                    <el-table-column label="业务单号" align="center" prop="businessNo" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="来源" align="center" prop="planName" min-width="120px" show-overflow-tooltip>
                        <template v-slot="{ row }">
                            <dict-tag :options="dict.type.purchase_source" :value="row.purchaseSource" />
                        </template>
                    </el-table-column>
                    <el-table-column label="采购编号" align="center" prop="purchaseNo" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="品牌" align="center" prop="brandName" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="车架号" align="center" prop="vinNo" min-width="120px" show-overflow-tooltip />
                    <el-table-column label="车牌号" align="center" prop="carNo" min-width="120px" show-overflow-tooltip />
                    <el-table-column label="业务类型" align="center" prop="value" min-width="120px" show-overflow-tooltip>
                        <template v-slot="{ row }">
                            <dict-tag :options="dict.type.business_type" :value="row.businessScope" />
                        </template>
                    </el-table-column>
                    <el-table-column label="所属归属城市" align="center" prop="ascription" min-width="120px"
                        show-overflow-tooltip />

                    <el-table-column label="审批人" align="center" prop="approvalName" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="审批时间" align="center" prop="approvalTime" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="操作人" align="center" prop="updateBy" min-width="120px"
                        show-overflow-tooltip />
                    <el-table-column label="操作时间" align="center" prop="updateTime" min-width="120px"
                        show-overflow-tooltip />
                </template>
            </table-page>

        </div>

    </div>
</template>

<script>
import SearchContent from "@/components/SearchContent/index.vue";
import * as inInventoryApi from "@/api/carInventory/inInventory";
import { json } from "vkbeautify";
export default {
    name: "InventoryHistory",
    components: {
        SearchContent,
    },
    dicts: ['business_type', 'purchase_source', 'in_storage_status'],
    data() {
        return {
            // 遮罩层
            loading: false,
            retutnCarTimes: [],
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                vinNo: null,
                carNo: null,
                ascription: null,
                purchaseSource: null,
                businessScopeCode: null,
                storageStatus: null,
                customerName: null,
            },
            total: 0,
            dataList: []

        };
    },
    mounted() {
        this.getList()
    },
    activated() {
        this.handleQuery()
    },
    methods: {
        /** 查询列表 */
        getList() {
            this.loading = true;
            inInventoryApi.storageRecordList(this.queryParams).then(res => {
                let info = JSON.parse(JSON.stringify(res.rows))
                info?.map((res) => {
                    res.businessScope = Number(res.businessScope)
                })
                this.dataList = res.rows;
                this.total = res.total;
            }).finally(() => {
                this.loading = false
            })
        },

        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },

        /** 重置按钮操作 */
        resetQuery() {
            this.$refs.queryForm.resetFields();
            this.handleQuery();
        },
        // 导出
        handleExport() {

        }

    }
};
</script>
